<template>
	<view>
		<headTop></headTop>

		<view class="orderAction">
			<button :class="isorder == 1 ? 'catives': 'catives1' "
				@click="getOrderDetail([0,2,6,8],1,true)">送货订单</button>
			<button :class="isorder == 3 ? 'catives': 'catives1' " @click="getOrderDetail([10],3,true)">送货历史订单</button>
			<button :class="isorder == 2 ? 'catives': 'catives1' "
				@click="getOrderDetail([16,12,13,14,15],2,true)">回收订单</button>
		</view>

		<view class="scroll-view-container">
			<scroll-view :style="{height:wh + 'px'}" scroll-y="true" @scrolltolower="paging"  :refresher-enabled="refresherEnabled"    
      @refresherrestore="onRestore" @refresherabort="onAbort"
       bindrefresherrefresh="toping"  :refresher-triggered="triggered" 
        @refresherrefresh="onRefresh"   @scroll='roll'
       >
				<block v-for="(item,index) in goodsInfo" :key="index">
					<view class="goodsInfo" @click='toGoodsDetail(item.id,item.orderStatus,item.payAmount)'>

						<view class="goodsDetail">
							<span>{{item.orderSn}}(订单号)</span>
						</view>
						<view class="detailTime">
							<span>{{item.createTime}}(创建时间)</span>
							<span class="detailTimeAction">{{item.orderAction}}</span>
						</view>

					</view>
				</block>
			</scroll-view>
			<button class="createdOrders" v-show="createOrde" @click="createdOrder">创建归还订单</button>
		</view>
	</view>
</template>

<script>
	import headTop from "@/components/common/headTop/headTop.vue";
	export default {
		data() {
			return {
				wh: 0,
				isorder: 1,
				pageNum: 1,
      
				flag: false,
				nextPage: false, // 判断有没有下一页
				createOrde: false,
				goodsInfo: [],
        refresherEnabled:true,
        triggered: false ,//设置当前下拉刷新的状态,
       
			}
		},
		components: {
			headTop
		},
		methods: {
       //自定义下拉刷新被触发
      	onRefresh() {
          console.log( 2345235 )
             this.triggered  = true 
              this.pageNum = 1
              	if (this.isorder == 2) {
              		this.getOrderDetail([16, 12, 13, 14, 15], 2,true)
              	} else if( this.isorder == 1 ){ 
                  this.getOrderDetail([0, 2, 6, 8], 1,true)		
              	}else if( this.isorder == 3 ){
                  this.getOrderDetail([10], 3,true)
              	}
                setTimeout(()=>{
                   this.triggered = false;
                 },1000)   
                                 //触发onRestore，关闭刷新图标  
                            // this.Isfreshing = false;  
                    
           },
           //自定义下拉刷新被复位
               onRestore() {
                 console.log( 4573895738 )
                   this.triggered = true; // 需要重置
                 
                   console.log("结束")
               },
          //自定义下拉刷新被中止
              onAbort() {
                  console.log("中断")
                  this.triggered = false
              },
          // 获取滚动距离
          roll(res) {
              if (res.target.scrollTop >= 20) {
                  this.refresherEnabled = false
              } else {
                  this.refresherEnabled = true
              }
          },
  

			paging() { //滚动到底部
				this.flag = true
				console.log("滚动" + this.nextPage)
				if (this.nextPage) { //为true  说明有
					this.pageNum++;
					if (this.isorder == 1) {
						this.getOrderDetail([0, 2, 6, 8], 1)
					} else if (this.isorder == 3) {
						this.getOrderDetail([10], 3)
					} else {
						this.getOrderDetail([16, 12, 13, 14, 15, ], 2)
					}
				}
			},
     

			//跳转商品详情页面
			toGoodsDetail(id, orderSta, money) {
				if (orderSta == 0) { //  说明是待付款
					uni.navigateTo({
						url: "/pages/payDetail/payDetail/payDetail?orderId=" + id + '&money=' + money

					})
				} else {
					uni.navigateTo({
						url: "/pages/orderDetail/orderDetail/orderDetail?id=" + id + "&orderSta=" + orderSta +
							"&isorder=" + this.isorder
					})
				}
			},

			// 时间格式转换
			renderTime(date) {
				var dateee = new Date(date).toJSON();
				return new Date(+new Date(dateee) + 8 * 3600 * 1000).toISOString().replace(/T/g, ' ').replace(/\.[\d]{3}Z/,
					'')
			},
			//创建归还订单
			createdOrder() {
				//  12/13 永远只能有一个 
				let arr = this.goodsInfo.filter(item => {
					return item.orderStatus == 12
				})
				console.log("有没有带回收订单", arr)
				if (arr.length > 0) {
					//说明有12的可回收订单存在
					return uni.showToast({
						title: '创建失败',
						duration: 1500,
						icon: 'error'
					});
				}


				console.log('请求创建归还订单接口 order/placeAnOrde', {
					"orderType": 1
				})
				this.$request.post('order/placeAnOrder', {
					"orderType": 1
				}).then(res => {
					console.log('获取归还订单接口 order/placeAnOrde', {
						"orderType": 1
					})
					this.goodsInfo = [];
					this.pageNum = 1
					this.getOrderDetail([16, 12, 13, 14, 15, ], 2)
				})
			},

			//初始化页面数据  
			getOrderDetail(orderId, active, flag) {
				if (active != this.isorder) {
					this.goodsInfo = []
				}

				if (active == 2) {
					//  创建归还订单的显示与否
					this.createOrde = true
				} else {
					this.createOrde = false
				}
				this.isorder = active
				// if ( orderId == 10 ){
				//   orderId = ''
				// }
				// this.$request.post('order/queryOrderInfo',{"orderStatus":orderId,"pageNum":"1","pageSize":"200"}).then(res=>{
				this.nextPage = false //  看看看这样能不能节流
				//  this.prePage = false  //  看看看这样能不能节流

				console.log('请求订单接口数据 order/queryOrderInfo', {
					"orderSts": orderId,
					"pageNum": this.pageNum,
					"pageSize": "20"
				})
				this.$request.post('order/queryOrderInfo', {
					"orderSts": orderId,
					"pageNum": this.pageNum,
					"pageSize": "20"
				}).then(res => {
					console.log('获取订单接口数据 order/queryOrderInfo', res)

					this.nextPage = res.data.hasNextPage


					if (res.data.list) {
						if (flag) {
							this.goodsInfo = res.data.list.map((item, index) => {
								item.createTime = this.renderTime(item.createTime)
								if (item.orderStatus == 2) {
									item.orderAction = '备货中'
								} else if (item.orderStatus == 0) {
									item.orderAction = '待付款'
								} else if (item.orderStatus == 4) {
									item.orderAction = '备货锁定'
								} else if (item.orderStatus == 6) {
									item.orderAction = '待发货'
								} else if (item.orderStatus == 8) {
									item.orderAction = '发货运输中'
								} else if (item.orderStatus == 10) {
									// item.orderAction = '可回收'
									item.orderAction = '已收货'
								} else if (item.orderStatus == 12) {
									item.orderAction = '待回收'
								} else if (item.orderStatus == 13) {
									// item.orderAction = '待确认'
									item.orderAction = '可回收'
								} else if (item.orderStatus == 14) {
									item.orderAction = '回收运输中 '
								} else if (item.orderStatus == 15) {
									item.orderAction = '回收锁定'
								} else if (item.orderStatus == 16) {
									item.orderAction = '回收完成'
								}
								return item
							})
						} else {
							res.data.list.map((item, index) => {
								item.createTime = this.renderTime(item.createTime)
								if (item.orderStatus == 2) {
									item.orderAction = '备货中'
								} else if (item.orderStatus == 0) {
									item.orderAction = '待付款'
								} else if (item.orderStatus == 4) {
									item.orderAction = '备货锁定'
								} else if (item.orderStatus == 6) {
									item.orderAction = '代发货'
								} else if (item.orderStatus == 8) {
									item.orderAction = '发货运输中'
								} else if (item.orderStatus == 10) {
									// item.orderAction = '可回收'
									item.orderAction = '已收货'
								} else if (item.orderStatus == 12) {
									item.orderAction = '待回收'
								} else if (item.orderStatus == 13) {
									// item.orderAction = '待确认'
									item.orderAction = '可回收'
								} else if (item.orderStatus == 14) {
									item.orderAction = '回收运输中 '
								} else if (item.orderStatus == 15) {
									item.orderAction = '回收锁定'
								} else if (item.orderStatus == 16) {
									item.orderAction = '回收完成'
								}
								this.goodsInfo.push(item)
								return item
							})


						}

					}


				})

			}
		},
		onLoad(option) {
			// 
			// this.getOrderDetail([2])

			this.isorder = option.isorder ? option.isorder : 1
			let sys = uni.getSystemInfoSync()
			this.wh = sys.windowHeight - 110
		},
		onShow() {
			this.$request.post('order/queryOrderInfo', {

				"pageNum": this.pageNum,
				"pageSize": "20"
			}).then(res => {
				console.log(res)

			})
			console.log("当前选择的是:", this.isorder)
			if (this.isorder == 1) {
				this.getOrderDetail([0, 2, 6, 8], 1, true)
			} else if (this.isorder == 3) {
				this.getOrderDetail([10], 3, true)
			} else if (this.isorder == 2) {
				this.getOrderDetail([16, 12, 13, 14, 15], 2, true)
			}
		},
		onPullDownRefresh() { //下拉刷新
    this.pageNum = 1
			if (this.isorder == 2) {
				this.getOrderDetail([16, 12, 13, 14, 15], 2,true)
			} else if( this.isorder == 1 ){ 
        this.getOrderDetail([0, 2, 6, 8], 1,true)		
			}else if( this.isorder == 3 ){
        this.getOrderDetail([10], 3,true)
			}
      wx.stopPullDownRefresh()
		}
	}
</script>

<style lang="scss" scoped>
	.orderAction {
		display: flex;
		justify-content: space-around;
		align-items: center;

		button {
			background-color: #fff;
			font-size: 36rpx;

			&:nth-child(2) {
				flex-grow: 1;
			}

		}
	}

	.scroll-view-container {
		background-color: rgb(236, 238, 240);

	}

	.goodsInfo {
		width: 98%;
		height: 160rpx;
		padding-left: 10rpx;
		box-sizing: border-box;
		display: flex;
		margin: 10rpx auto;
		background-color: #fff;
		flex-direction: column;
		justify-content: space-evenly;
		align-items: flex-start;
		// border: 1rpx solid black;
		// box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2);


		border-radius: 10rpx;

		.detailTime {
			width: 100%;
			display: flex;
			align-items: center;
			justify-content: space-between;
			align-items: center;

			span {
				// padding: 0 20rpx;
			}

			.detailTimeAction {
				padding-right: 10rpx;
			}
		}
	}

	.createdOrders {
		width: 29%;
		font-size: 24rpx;
		position: fixed;
		bottom: 30rpx;
		right: 10rpx;
		background-color: rgb(140, 199, 181);

	}

	.catives {
		color: rgb(140, 199, 181);
		padding-left: 20rpx;
		padding-right: 20rpx;
		font-size: 40rpx;
	}

	.catives1 {
		padding-left: 20rpx;
		padding-right: 20rpx;
		font-size: 40rpx;
	}
</style>